	<script>
		$(function(){
			$('#dd').dialog({
				toolbar:[{
					text:'新建',
					iconCls:'icon-add',
					handler:function(){
						alert('add')
					}
				},'-',{
					text:'保存',
					iconCls:'icon-save',
					handler:function(){
						alert('save')
					}
				}],
				buttons:[{
					text:'确定',
					iconCls:'icon-ok',
					handler:function(){
						alert('ok');
					}
				},{
					text:'取消',
					handler:function(){
						$('#dd').dialog('close');
					}
				}]
			});
		});
		function open1(){
			$('#dd').dialog('open');
		}
		function close1(){
			$('#dd').dialog('close');
		}
	</script>
</head>
<body>
	<h2>对话框 - Dialog</h2>
	<div class="demo-info">
		<div class="demo-tip icon-tip"></div>
		<div>点击下面按钮来打开或关闭对话框。<br>
		</div>
	</div>
	
	<div style="margin:10px 0;"><a href="#" class="easyui-linkbutton" onclick="open1()">打开</a>
		<a href="#" class="easyui-linkbutton" onclick="close1()">关闭</a>
	</div>
	<div id="dd" data-options="iconCls:'icon-save'" style="padding:5px;width:400px;height:200px;">
		<p>dialog content.</p>
		<p>dialog content.</p>
		<p>dialog content.</p>
		<p>dialog content.</p>
		<p>dialog content.</p>
		<p>dialog content.</p>
		<p>dialog content.</p>
		<p>dialog content.</p>
	</div>
	<div id="d2" class="easyui-dialog" title="Another Dialog" style="width:400px;height:200px;left:100px;top:150px;padding:10px"
			data-options="toolbar:'#dlg-toolbar',buttons:'#dlg-buttons',resizable:true">从现有的HTML节点创建的对话框、按钮和工具栏。<br>
</div>
	<div id="dlg-toolbar" style="padding:2px 0">
		<table cellpadding="0" cellspacing="0" style="width:100%">
			<tr>
				<td style="padding-left:2px">
					<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">编辑</a>
					<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-help',plain:true">帮助</a>
				</td>
				<td style="text-align:right;padding-right:2px">
					<input class="easyui-searchbox"></input>
				</td>
			</tr>
		</table>
	</div>
	<div id="dlg-buttons">
		<a href="#" class="easyui-linkbutton" onclick="javascript:alert('save')">保存</a>
		<a href="#" class="easyui-linkbutton" onclick="javascript:$('#d2').dialog('close')">关闭</a>
	</div>
<h3>页面代码： </h3>
<pre name="code" class="html">&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
	&lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=UTF-8&quot;&gt;
	&lt;title&gt;Dialog - jQuery EasyUI Demo&lt;/title&gt;
	&lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;../themes/default/easyui.css&quot;&gt;
	&lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;../themes/icon.css&quot;&gt;
	&lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;demo.css&quot;&gt;
	&lt;script type=&quot;text/javascript&quot; src=&quot;../jquery-1.7.2.min.js&quot;&gt;&lt;/script&gt;
	&lt;script type=&quot;text/javascript&quot; src=&quot;../jquery.easyui.min.js&quot;&gt;&lt;/script&gt;
	&lt;script&gt;
		$(function(){
			$('#dd').dialog({
				toolbar:[{
					text:'新建',
					iconCls:'icon-add',
					handler:function(){
						alert('add')
					}
				},'-',{
					text:'保存',
					iconCls:'icon-save',
					handler:function(){
						alert('save')
					}
				}],
				buttons:[{
					text:'确定',
					iconCls:'icon-ok',
					handler:function(){
						alert('ok');
					}
				},{
					text:'取消',
					handler:function(){
						$('#dd').dialog('close');
					}
				}]
			});
		});
		function open1(){
			$('#dd').dialog('open');
		}
		function close1(){
			$('#dd').dialog('close');
		}
	&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
	&lt;h2&gt;对话框 - Dialog&lt;/h2&gt;
	&lt;div class=&quot;demo-info&quot;&gt;
		&lt;div class=&quot;demo-tip icon-tip&quot;&gt;&lt;/div&gt;
		&lt;div&gt;点击下面按钮来打开或关闭对话框。&lt;br&gt;
		&lt;/div&gt;
	&lt;/div&gt;
	
	&lt;div style=&quot;margin:10px 0;&quot;&gt;&lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; onclick=&quot;open1()&quot;&gt;打开&lt;/a&gt;
		&lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; onclick=&quot;close1()&quot;&gt;关闭&lt;/a&gt;
	&lt;/div&gt;
	&lt;div id=&quot;dd&quot; data-options=&quot;iconCls:'icon-save'&quot; style=&quot;padding:5px;width:400px;height:200px;&quot;&gt;
		&lt;p&gt;dialog content.&lt;/p&gt;
		&lt;p&gt;dialog content.&lt;/p&gt;
		&lt;p&gt;dialog content.&lt;/p&gt;
		&lt;p&gt;dialog content.&lt;/p&gt;
		&lt;p&gt;dialog content.&lt;/p&gt;
		&lt;p&gt;dialog content.&lt;/p&gt;
		&lt;p&gt;dialog content.&lt;/p&gt;
		&lt;p&gt;dialog content.&lt;/p&gt;
	&lt;/div&gt;
	&lt;div id=&quot;d2&quot; class=&quot;easyui-dialog&quot; title=&quot;Another Dialog&quot; style=&quot;width:400px;height:200px;left:100px;top:150px;padding:10px&quot;
			data-options=&quot;toolbar:'#dlg-toolbar',buttons:'#dlg-buttons',resizable:true&quot;&gt;从现有的HTML节点创建的对话框、按钮和工具栏。&lt;br&gt;
&lt;/div&gt;
	&lt;div id=&quot;dlg-toolbar&quot; style=&quot;padding:2px 0&quot;&gt;
		&lt;table cellpadding=&quot;0&quot; cellspacing=&quot;0&quot; style=&quot;width:100%&quot;&gt;
			&lt;tr&gt;
				&lt;td style=&quot;padding-left:2px&quot;&gt;
					&lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; data-options=&quot;iconCls:'icon-edit',plain:true&quot;&gt;编辑&lt;/a&gt;
					&lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; data-options=&quot;iconCls:'icon-help',plain:true&quot;&gt;帮助&lt;/a&gt;
				&lt;/td&gt;
				&lt;td style=&quot;text-align:right;padding-right:2px&quot;&gt;
					&lt;input class=&quot;easyui-searchbox&quot;&gt;&lt;/input&gt;
				&lt;/td&gt;
			&lt;/tr&gt;
		&lt;/table&gt;
	&lt;/div&gt;
	&lt;div id=&quot;dlg-buttons&quot;&gt;
		&lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; onclick=&quot;javascript:alert('save')&quot;&gt;保存&lt;/a&gt;
		&lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; onclick=&quot;javascript:$('#d2').dialog('close')&quot;&gt;关闭&lt;/a&gt;
	&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;</pre>
<SCRIPT type=text/javascript>
	dp.SyntaxHighlighter.ClipboardSwf = 'documentation/js/clipboard.swf'/*tpa=http://jeasyui.com/SyntaxHighlighter/Scripts/clipboard.swf*/;
	dp.SyntaxHighlighter.HighlightAll('code');
</SCRIPT>
